<!doctype html>
<html>
<head>
  <title>Network | Playing with Physics</title>

  <style type="text/css">
    body {
      font: 10pt sans;
    }
    #mynetwork {
      float:left;
      width: 600px;
      height: 600px;
      margin:5px;
      border: 1px solid lightgray;
    }
    #config {
      float:left;
      width: 400px;
      height: 600px;
    }

    p {
      font-size:16px;
      max-width:700px;
    }
  </style>


  <script type="text/javascript" src="../exampleUtil.js"></script>
  <script type="text/javascript" src="../../../dist/vis.js"></script>
  <link href="../../../dist/vis.css" rel="stylesheet" type="text/css" />

  <script type="text/javascript">
    var nodes = null;
    var edges = null;
    var network = null;

    function draw() {
      nodes = [];
      edges = [];
      // randomly create some nodes and edges
      var data = getScaleFreeNetwork(25);

      // create a network
      var container = document.getElementById('mynetwork');

      var options = {
        physics: {
          stabilization: false
        },
        configure: true
      };
      network = new vis.Network(container, data, options);
    }
  </script>
  <script src="../../googleAnalytics.js"></script>
</head>

<body onload="draw();">

<p>
  The configurator can be used to play with the options. In this example, all options that can be configured with this tool are shown.
  You can also supply a custom filter function or filter string. You can press the generate options button below to have an options object printed. You can then use
  this in the network.
</p>
<br />
<div id="mynetwork"></div>

<p id="selection"></p>
</body>
</html>
